<style type="text/css">
.box {
	overflow: hidden;
}
</style>
<script type="text/javascript">
jQuery(document).ready(function() {
	jQuery('.box').stop().mouseover(function(){
		jQuery(this).find('.info').animate({'left':10});
	});

	jQuery('.box').stop().mouseleave(function(){
		jQuery(this).find('.info').animate({'left':340});
	});

});
</script>
<?php
echo $html->div(
  'paginate','
  <span>TRENDING:</span>
  <a href="#">BREAKFAST</a><a href="#">LUNCH</a>
  <a href="#">SNACKS</a><a href="#">DINNER</a>
  ');
 ?>

<div class="clearfix">				 
		<div id="grid">
			<div id="sort">
				<?php
				foreach($data as $Cuisine) {
					$url_path = HOSTNAME.'/albums/cuisines/'.$Cuisine['Cuisine']['id'];
				?>
				<div class="box<?php echo ($Cuisine['Cuisine']['is_featured'])?' featbox':'';?>">											
					<a href="<?php echo $url_path?>"><img width="320" title="weee-man" alt="<?php echo $Cuisine['Cuisine']['title'];?>" class="thumbnail wp-post-image" src="<?php echo HOSTNAME.'/thumbs/?src=/app/webroot/img/cuisines/'.$Cuisine['Cuisine']['path'].'&w=300&zc=1&q=100';?>" style="opacity: 1;"></a>
					<div class="info">
					<h1><a rel="bookmark" href="<?php echo $url_path?>"><?php echo $Cuisine['Cuisine']['title'];?></a></h1>
					<p><?php echo $Cuisine['Cuisine']['description'];?></p>
					<a href="<?php echo $url_path?>" class="boxa"><span>Read More &raquo;</span></a>
					<!-- <p class="postmetadata"> Stack | <a rel="category tag" title="View all posts in Sculpture" href="#">Dishes</a>  </p> -->
					</div>																				
				</div>				
				<?php } ?>			
			</div>
		</div>
</div>

<?php
echo $html->div(
  'paginate',
  $paginator->numbers(array('separator'=>null))
);  
?>
<br/>